<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
选择您喜欢的书:<input type="radio" name="book" value="" onclick="chageimg1()">我和狗狗一起活下来<input onclick="chageimg2()" type="radio" name="book" value="">灰霾来了怎么办
<br>
<!--<img src="" id="img">-->
<div id="imgList">

</div>

<img src="images/dog.jpg" id="delImg"> <button onclick="delNode()">删除节点</button>

<script type="text/javascript">
    function chageimg1() {
        //创建节点
        let img =  document.createElement("img");
        img.setAttribute("src","images/dog.jpg");//设置属性

        //追加节点
        document.getElementById("imgList").appendChild(img);
    }

    function delNode() {
        //删除节点
        let imgNode = document.getElementById("delImg");
        //父节点删除子节点
        // imgNode.parentNode.removeChild(imgNode);
        // imgNode.remove(); //删除自己
        let img =  document.createElement("img");
        img.setAttribute("src","images/mai.jpg");//设置属性

        //替换节点 新节点 老节点
        imgNode.parentNode.replaceChild(img,imgNode);
    }
    function chageimg2() {
        // let img =  document.getElementById("img");
        let img =  document.createElement("img");
        img.setAttribute("src","images/mai.jpg");//设置属性
        document.getElementById("imgList").appendChild(img);
    }
</script>
</body>
</html>